<template>
    <div class="container">
      <template>
        <div style="margin:20px">
          <el-input v-model="input" placeholder="请输入关键字" style="width:200px"></el-input><el-button style="margin-left:10px" type="success">搜索</el-button> 
        </div>
        <el-button type="primary" style="margin:20px" @click="dialogFormVisible = true"><i class="el-icon-circle-plus-outline"></i>&nbsp;&nbsp;销售退货订单</el-button><el-button type="danger" style="margin:20px" @click="dialogFormVisible = true" icon="el-icon-remove-outline">批量删除</el-button>
        <el-dialog title="添加采购订单" :visible.sync="dialogFormVisible">
          <el-form :model="form">
            <el-form-item label="供应商名" :label-width="formLabelWidth">
              <el-input v-model="form.username" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="编码" :label-width="formLabelWidth">
              <el-input v-model="form.encode" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="负责人姓名" :label-width="formLabelWidth">
              <el-input v-model="form.encode" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="电话号码" :label-width="formLabelWidth">
              <el-input v-model="form.encode" autocomplete="off"></el-input>
            </el-form-item>
            <el-form-item label="供应商类别" :label-width="formLabelWidth">
              <el-input v-model="form.encode" autocomplete="off"></el-input>
            </el-form-item>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button @click="dialogFormVisible = false">取消</el-button>
            <el-button type="primary" @click="dialogFormVisible = false; add()">添加</el-button>
          </div>
        </el-dialog>
        <div class="formContainer">
        <el-table :data="tableData" border style="width: 159.8vh" :header-cell-style="{ textAlign: 'center' }"
:cell-style="{ textAlign: 'center' }">
          <el-table-column  type="selection" width="40" fixed="left"></el-table-column>
          <el-table-column  prop="id" label="订单id" width="63" fixed="left">
          </el-table-column>
          <el-table-column  prop="username" label="待退商品名" width="180" fixed="left">
          </el-table-column>
          <el-table-column prop="encode" label="待退商品编码" width="150">
          </el-table-column>
          <el-table-column prop="name" label="待退商品数量" width="153">
          </el-table-column>
          <el-table-column prop="phonenumber" label="待退商品单位" width="180">
          </el-table-column>
          <el-table-column prop="suppliergroup" label="待退商品价格" width="180">
          </el-table-column>
          <el-table-column prop="phonenumber" label="待退客户编码" width="180">
          </el-table-column>
          <el-table-column prop="addtime" label="审批状态" width="137">
        </el-table-column>
          <el-table-column label="操作" width="150" fixed="right">
            <template slot-scope="scope">
              <el-button type="success" circle size="mini">审批</el-button>
              <el-button type="primary" icon="el-icon-edit" size="mini" circle></el-button>
            <el-button type="danger" icon="el-icon-delete" circle size="mini"></el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      </template>
    </div>
  </template>
  
  <script>
  export default {
    data(){
      return {
        formLabelWidth:'120px',
        dialogFormVisible:false,
        form: {
          username: '111',
          password: '111',
          code: '111',
          id: '111',
          encode:'',
          supplier:''
        },tableData:[{
            id: '1',
            suppliername: '王小虎',
            encode: '123567',
            group:'1',
            name:'2002',
            phonenumber: '23311341',
            suppliergroup:'12',
            addtime:'20020217'
          },{
            id: '1',
            suppliername: '王小虎',
            encode: '123567',
            group:'1',
            name:'2002',
            phonenumber: '23311341',
            suppliergroup:'12',
            addtime:'20020217'
          },{
            id: '1',
            suppliername: '王小虎',
            encode: '123567',
            group:'1',
            name:'2002',
            phonenumber: '23311341',
            suppliergroup:'12',
            addtime:'20020217'
          }]
      }
    }
  }
  </script>
  
  <style lang="less" scoped>
  .formContainer{
    padding: 30px;
  }
  </style>